import React, { useEffect } from "react"
import { useDispatch, useSelector } from "react-redux"
import ArticlesItem from "../../components/ArticlesItem"
import NavTop from "../../components/NavTop"

import { getCollect } from "../../store/actions"
import "./index.scss"
function Collect() {
  const dispatch = useDispatch()

  useEffect(() => {
    dispatch(getCollect())
  }, [dispatch])

  const { collect } = useSelector((state) => state.my)
  const { results } = collect
  return (
    <div className="collect">
      <NavTop title="我的收藏" />
      <div>
        {results?.map((item) => {
          return <ArticlesItem key={item.art_id} articles={item}></ArticlesItem>
        })}
      </div>
      <div className="bottom">没有更多了</div>
    </div>
  )
}

export default Collect
